<!DOCTYPE html>
<html>
<head>
	<meta charset="UTF-8">
	<meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
	<title>Document</title>

	<style>
	/* em */
	/* body {
		font-size: 12px;
	}
	
	.em-wp {
		font-size: 2em;
	}
	
	.em {
		font-size: 0.5em;
	}*/

	/* rem */
	html {
		font-size: 20px; /* font-size: 100px; */
	}

	.rem-wp {
		font-size: 1.5rem;
	}

	.rem {
		font-size: 1rem;
		width: 5rem;
		height: 2.5rem;
		border: 1px solid red;
		margin-top: 1rem;
	}

	</style>
</head>
<body>

	<div class="rem-wp">
		demo1
		<div class="rem">
			demo2
		</div>
	</div>

	 <!--<div class="em-wp">
		test text
		<div class="em">
			test text2
		</div>
	</div> -->
	
</body>
</html>